<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页面</title>
    <link rel="stylesheet" type="text/css" href="index.css">

</head>
<body>

    <div class="beijing">
        <div class="juzhong">
            <div><img src="./images/b.jpg" class="logo1"></div>
            <ul class="lie1">
                <li><a href="./index.html">首页</a></li>
                <li><a href="./index4.html">目的地</a></li>
                <li><a href="./index5.html">旅游攻略</a></li>
                <li><a href="./index6.html">去旅行</a></li>
            </ul>
            <div><img src="./images/a1.png" class="logo2"></div>
            <ul class="lie2">
                <li><a href="./index2.html">登录</a></li>
                <li>|</li>
                <li><a href="./index3.html">注册</a></li>
            </ul>
        </div>
        <div class="lunbotu">
            <div class="slide">
                <img src="./images/lun1.jpg" alt="Slide 1">
            </div>
            <div class="slide">
                <img src="./images/lun2.jpg" alt="Slide 2">
            </div>
            <div class="slide">
                <img src="./images/lun3.jpg" alt="Slide 3">
            </div>
            <div class="slide">
                <img src="./images/lun4.jpg" alt="Slide 1">
            </div>
            <div class="slide">
                <img src="./images/lun5.jpg" alt="Slide 2">
            </div>
            <div class="slide">
                <img src="./images/lun6.jpg" alt="Slide 3">
            </div>
            <div class="left">
                &lt;
            </div>
            <div class="right">
                &gt;
            </div>
            <div class="zhiding">
                <ul>
                    <li class="div1"></li>
                    <li class="div2"></li>
                    <li class="div3"></li>
                    <li class="div4"></li>
                    <li class="div5"></li>
                    <li class="div6"></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="souji">
        <div class="remen"><p3>热门目的地</p3></div>
        <div class="remen1">
            <ul class="lie3">
                <li><a href="" data-target="div1">郑州</a></li>
                <li><a href="" data-target="div2">开封</a></li>
                <li><a href="" data-target="div3">洛阳</a></li>
                <li><a href="" data-target="div4">南阳</a></li>
                <li><a href="" data-target="div5">新乡</a></li>
                <li><a href="" data-target="div6">三门峡</a></li>
            </ul>
        </div>
        <div id="div1" class="butong" style="display: block;">
            <div class="zhengzhou"></div>
            <div class="zheng"><p>郑州风景名胜</p>
                <a href="index7.html">黄河风景线</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;展现了黄河壮丽的河流景色和周边的自然风光。游客可以欣赏黄河两岸的美景，感受黄河流域的雄浑气势。这里也有黄河湿地、黄河岸边的自然景观，是观赏自然美景的好去处。
                <br><br>
                <a href="">郑州古城</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;郑州古城区保存了许多历史文化遗迹和古代建筑，如城隍庙、二七纪念塔等。这些古迹展现了郑州悠久的历史和丰富的文化底蕴。游客可以在古城区感受古代建筑风格，探索郑州丰富的历史文化。
                <br><br>
                <a href="">黄帝故里</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;黄帝故里是中国传说中黄帝的诞生地，是中国文化的重要象征之一。这里有黄帝陵、轩辕祭坛等重要的历史遗迹，吸引着众多游客前来探访，领略黄帝文化的魅力与神秘。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;郑州以其丰富多样的景点和悠久的历史文化，吸引着许多游客前来探索和领略。这些景点展示了郑州独特的自然风光和悠久的历史传承。</div>
        </div>
        <div id="div2" class="butong" style="display: none;">
            <div class="kaifeng"></div>
            <div class="kai"><p>开封风景名胜</p>
                <a href="index8.html">龙亭公园</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;龙亭公园是开封市的标志性景点之一，也是中国著名的历史文化公园。这里有龙亭、铁塔、书院等古建筑，同时也有湖泊、荷花池等自然景观。游客可以在这里感受古代建筑的魅力，欣赏美丽的自然风光。
                <br><br>
                <a href="">开封府</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;开封府是开封市的另一处历史文化遗址，是古代开封的政治中心。这里有开封府衙、府学、府署等古建筑，展现了古代政治、文化的繁荣。游客可以在这里了解古代官制和文化特色。
                <br><br>
                <a href="">化龙池</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;化龙池是开封的著名景点，是一处古老的人工湖泊。池中有着美丽的湖景和青山绿水，周围是绿树成荫的环境。游客可以在这里感受宁静的氛围，漫步湖畔，享受自然美景。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;开封以其悠久的历史、丰富的文化和优美的自然风光吸引着许多游客前来探索和体验。这些景点展现了开封丰富多彩的历史文化和迷人的自然景观。
            </div>

        </div>
        <div id="div3" class="butong" style="display: none;">
            <div class="luoyang"></div>
            <div class="luo"><p>洛阳风景名胜</p>
                <a href="index9.html">龙门石窟</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;龙门石窟是世界文化遗产，位于洛阳城南约12公里处。这里保存着丰富的石窟艺术，包括雕刻、壁画等。龙门石窟是中国石窟艺术的代表之一，内容涵盖佛教、道教等多个宗教。
                <br><br>
                <a href="">白马寺</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;白马寺是中国佛教四大名寺之一，位于洛阳市区。建于东晋时期，历史悠久。白马寺保存着许多古建筑和珍贵文物，其中有很多历史悠久的石刻和佛像。
                <br><br>
                <a href="">洛阳老城区</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;洛阳老城区保留了许多古代建筑和历史文化遗迹。在这里可以看到传统的建筑风格和民俗文化。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;洛阳以其悠久的历史、丰富的文化底蕴和壮丽的自然风光吸引着许多游客前来探索和领略。这些景点展示了洛阳独特的历史文化和迷人的自然景观。
            </div>
        </div>
        <div id="div4" class="butong" style="display: none;">
            <div class="nanyang"></div>
            <div class="nan"><p>南阳风景名胜</p>
                <a href="index10.html">卧龙山</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;卧龙山是南阳市的著名景点之一，地处南阳市区西南部。这里山势险峻，风光秀丽，有着茂密的植被和清澈的溪流。游客可以在这里徒步登山，感受大自然的魅力，也可以领略到壮观的山景和丰富的生态环境。
                <br><br>
                <a href="">伏牛山</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;伏牛山脉横跨在南阳市境内，是中国著名的山脉之一。山势起伏，景色优美，山间有着茂密的森林和丰富的野生动植物。伏牛山不仅是登山爱好者的天堂，也是探险和户外活动的理想场所
                <br><br>
                <a href="">千佛山</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;南阳的千佛山以其独特的佛教文化而著称。山上有着许多古代佛教石窟和石刻艺术，其中包括了大量的佛像和佛教造像。游客可以在这里感受到悠久的佛教文化底蕴，欣赏石窟艺术的魅力。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;这些景点展现了南阳丰富多彩的自然风光和悠久的文化传承，吸引着许多游客前来探索和领略。无论是自然景观还是历史文化，都给予游客深刻的体验和难忘的回忆。
            </div>
        </div>
        <div id="div5" class="butong" style="display: none;">
            <div class="xinxiang"></div>
            <div class="xin"><p>新乡风景名胜</p>
                <a href="index11.html">辉县大峡谷</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;辉县大峡谷是新乡的著名景点之一，位于辉县市境内。这里地形险峻，山峦起伏，峡谷深邃，景色壮观。游客可以欣赏到悬崖峭壁、清澈溪流以及丰富的岩层地貌，还可以进行徒步探险、漂流等户外活动，感受大自然的魅力。
                <br><br>
                <a href="">潭柘寺</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;潭柘寺是一座历史悠久的佛教寺庙，坐落在新乡市区。寺内有古老的建筑群和独特的佛教文化遗迹。游客可以在这里感受宁静的寺庙氛围，领略古老建筑的魅力，了解佛教文化的精髓。
                <br><br>
                <a href="">卧龙谷</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;卧龙谷地处新乡市境内，是一个景色优美的旅游区。这里有着峡谷、溪流、森林等丰富的自然景观，山清水秀，环境幽静。游客可以在这里徒步漫游，享受大自然的宁静与美景。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;新乡的这些景点展示了其多样化的自然风光和悠久的文化底蕴，吸引着许多游客前来探索和欣赏。这些地方提供了丰富多彩的户外体验和历史文化之旅。
            </div>
        </div>
        <div id="div6" class="butong" style="display: none;">
            <div class="sanmenxia"></div>
            <div class="san"><p>三门峡风景名胜</p>
                <a href="index12.html">陕州龙湾景区</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;陕州龙湾景区位于三门峡市陕州区，是该地区著名的景点之一。这里有着清澈的湖水和峡谷景观，山清水秀。游客可以在这里欣赏到壮丽的自然景色，感受大自然的神奇和宁静。
                <br><br>
                <a href="">香山公园</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;香山公园是三门峡市内的一个休闲胜地，风景优美。公园内有着郁郁葱葱的树木和宁静的湖泊，是市民休闲散步、观景的理想场所。游客可以在这里感受到都市中的宁静和清新空气。
                <br><br>
                <a href="">双龙湾风景区</a><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;双龙湾风景区位于三门峡市境内，以其优美的湖泊景色和宁静的环境而闻名。这里有清澈的湖水和丰富的湿地植被，是欣赏自然景色和观鸟的理想地点。游客可以在这里感受到湖光山色带来的宁静和舒适。
                <br><br>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;这些景点展现了三门峡丰富多彩的自然风光和优美的生态环境，吸引着许多游客前来探索和享受大自然的魅力。
            </div>
        </div>

    </div>
    <div class="dibu">
        <div class="dibu1"><p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;在这里，探索世界的精彩从未如此简单。我们致力于为您带来独特的旅行体验，让您在旅途中充满愉悦与<br>惊喜。无论您钟情于探索自然风光还是追寻文化遗产，我们提供丰富多样的目的地选择，为您量身定制独特的<br>行程。从令人惊叹的地标到隐藏的宝藏景点，我们的目标是带您发现世界的美丽之处。您可以轻松规划完美的<br>行程，预订舒适的住宿并获得独家的旅游攻略。无论是家庭度假、探险旅行还是文化体验，我们都努力为您提<br>供最优质的服务。让我们一起开启精彩的旅程，创造属于您自己的不可思议回忆!</p></div>
    </div>
    <script type="text/javascript" src="../jquery-3.4.1.min.js"></script>
    <script type="text/javascript">
        $(function (){
            var index = 0; // 标记索引
            var slides = $(".slide");
            var f;
            dingshiqi();
            function dingshiqi() {

                f = setInterval(function () {
                    slides.css("opacity", "0"); // 将所有轮播元素的透明度设为 0
                    if (index === slides.length - 1) {
                        index = 0; // 如果索引达到最大值，重置为 0
                    } else {
                        index++; // 否则索引加一
                    }
                    slides.eq(index).css("opacity", "1"); // 将当前索引对应的轮播元素的透明度设为 1
                }, 4000);
            }
            $(".left").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                if(index === 0){
                    index = slides.length - 1;

                }else{
                    index--;

                }
                slides.eq(index).css("opacity", "1");
                dingshiqi();
            })
            $(".right").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                if(index === slides.length - 1){
                    index = 0;

                }else{
                    index++;

                }
                slides.eq(index).css("opacity", "1");
                dingshiqi();
            })
            $(".div1").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(0).css("opacity", "1");
                index = 0;
                dingshiqi();
            })
            $(".div2").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(1).css("opacity", "1");
                index = 1;
                dingshiqi();
            })
            $(".div3").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(2).css("opacity", "1");
                index = 2;
                dingshiqi();
            })
            $(".div4").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(3).css("opacity", "1");
                index = 3;
                dingshiqi();
            })
            $(".div5").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(4).css("opacity", "1");
                index = 4;
                dingshiqi();
            })
            $(".div6").click(function (){
                clearInterval(f);
                slides.css("opacity", "0");
                slides.eq(5).css("opacity", "1");
                index = 5;
                dingshiqi();
            })
        });
        $(document).ready(function(){
            $(".lie3 a").mouseenter(function(){
                var targetDiv = $(this).data("target"); // 获取 data-target 的值
                $(".butong").hide(); // 隐藏所有的 target-div
                $("#" + targetDiv).show(); // 显示对应的 target-div
            });
        });
    </script>
</body>
</html>